<html>
  <head>
    <meta charset="utf-8" />
    <title>文曲星 | openApi</title>
    <link rel="stylesheet" href="../../css/common.css" />
    <link rel="stylesheet" href="../../utils/layui/css/layui.css" />
    <script src="../../utils/axios.min.js"></script>
    <script src="../../utils/jquery-3.5.1.min.js"></script>
    <script src="../../utils/layui/layui.js"></script>
    <script src="./js/openApi.js"></script>
  </head>

  <body>
    <!-- 头部 -->
    <div class="header">
      <button class="login layui-btn layui-btn-primary">登 录</button>
      <div class="login-success">
        <span>登录成功</span>
        <button class="getApiKey layui-btn layui-btn-primary">
          获取ApiKey
        </button>
      </div>
    </div>
    <!-- 中间文档部分 -->
     <div class="main">
    <h1 style="font-size: 2.6vw;" id="top">文曲星OpenApi文档</h1>
    <div>文曲星核心业务功能为智能问答和个性化推荐功能，由于个性化功能与平台耦合性强，不适合提供OpenApi,故只提供智能问答服务的OpenApi接口。</div>
    <br><br><br>
    
    <h1 id="mid1">接口说明</h1>
    <div>智能问答接口，用户可以通过上传文本内容、图片文件、pcm音频文件中的问题来获得文曲星的智能解答。</div>
    <br><br><br>

    <h1 id="mid2">接口要求及Demo</h1>
    <h2 id="mid2-1">文本格式问题</h2>
    <div>上传文本格式的问题时，需按照以下要求：</div>
    <table class="layui-table" style="width: 45vw; background-color: #fefefe;border: .1vw solid #d0e5ff; margin: 1vw 0;">
        <colgroup>
            <col width="150">
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>内容</th>
                <th>说明</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>请求协议</td>
                <td>http</td>
            </tr>
            <tr>
                <td>请求地址</td>
                <td>http://106.53.218.88:10010/QaA/api</td>
            </tr>
            <tr>
                <td>请求类型</td>
                <td>GET</td>
            </tr>
            <tr>
                <td>接口鉴权</td>
                <td>见下方接口鉴权</td>
            </tr>
            <tr>
                <td>字符编码</td>
                <td>UTF-8</td>
            </tr>
            <tr>
                <td>响应格式</td>
                <td>直接响应文本数据</td>
            </tr>
            <tr>
                <td>接收方式</td>
                <td>流式接收</td>
            </tr>
            <tr>
                <td>开发语言</td>
                <td>任意，可以向文曲星服务发起http请求即可</td>
            </tr>
            <tr>
                <td>操作系统</td>
                <td>任意</td>
            </tr><tr>
                <td>问题类型</td>
                <td>任何问题均可，关于课程相关知识点的回复更加精确和详细</td>
            </tr><tr>
                <td>语言种类</td>
                <td>中文</td>
            </tr>
        </tbody>
    </table>
    <div style="font-weight: 700;">接口参数</div>
    <table class="layui-table" style="width: 45vw; background-color: #fefefe;border: .1vw solid #d0e5ff; margin: 1vw 0;">
        <colgroup>
            <col><col><col><col><col>
        </colgroup>
        <thead>
            <tr>
                <th>参数</th>
                <th>类型</th>
                <th>必须</th>
                <th>说明</th>
                <th>示例</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>question</td>
                <td>string</td>
                <td>是</td>
                <td>用户的问题</td>
                <td>请问李白是哪个朝代的诗人？</td>
            </tr>
            <tr>
                <td>authorization</td>
                <td>请求头参数</td>
                <td>是</td>
                <td>用户鉴权根据</td>
                <td>即你的ApiKey</td>
            </tr>
        </tbody>
    </table>
    <div>故请求示例为：http://106.53.218.88:10010/QaA/api?question={yourQuestion}&authorization={yourAuthorization}</div>
    <div style="font-weight: 700;">Demo</div>
    <div>以下是客户端调用文曲星接口的代码示例（Java）：</div>
    <pre class="layui-code code-demo" style="margin-bottom: 1vw;">
  public static void main(String[] args) throws IOException {
    String question = "你好";
    String url = "http://localhost:10010/QaA/api?question="+question;
    String authorization = "yourAuthorization";
    CloseableHttpClient httpClient = HttpClients.createDefault();
    HttpGet request = new HttpGet(url);
    request.addHeader("authorization",authorization);
    CloseableHttpResponse response = httpClient.execute(request);
    HttpEntity entity = response.getEntity();
    InputStreamReader inputStreamReader = new InputStreamReader(entity.getContent(), StandardCharsets.UTF_8);
    BufferedReader reader = new BufferedReader(inputStreamReader);
      String line;
      while ((line = reader.readLine()) != null) {
        System.out.println(line+"\t"); // 打印接收到的数据
      }
  }
    </pre>

    <h2 id="mid2-2">附带图片上传</h2>
    <div>上传图片格式问题时，需按照以下要求：</div>
    <table class="layui-table" style="width: 45vw; background-color: #fefefe;border: .1vw solid #d0e5ff; margin: 1vw 0;">
        <colgroup>
            <col width="150">
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>内容</th>
                <th>说明</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>请求协议</td>
                <td>http</td>
            </tr>
            <tr>
                <td>请求地址</td>
                <td>http://106.53.218.88:10010/QaA/api/image</td>
            </tr>
            <tr>
                <td>请求类型</td>
                <td>POST</td>
            </tr>
            <tr>
                <td>接口鉴权</td>
                <td>见下方接口鉴权</td>
            </tr>
            <tr>
                <td>字符编码</td>
                <td>UTF-8</td>
            </tr>
            <tr>
                <td>响应格式</td>
                <td>直接响应文本数据</td>
            </tr>
            <tr>
                <td>接收方式</td>
                <td>流式接收</td>
            </tr>
            <tr>
                <td>开发语言</td>
                <td>任意，可以向文曲星服务发起http请求即可</td>
            </tr>
            <tr>
                <td>操作系统</td>
                <td>任意</td>
            </tr>
            <tr>
                <td>问题类型</td>
                <td>任何问题均可，关于课程相关知识点的回复更加精确和详细</td>
            </tr>
            <tr>
                <td>语言种类</td>
                <td>中文</td>
            </tr>
        </tbody>
    </table>
    <div style="font-weight: 700;">接口参数</div>
    <div>authorization为请求头参数，question和image为请求体参数并且为form-data格式。</div>
    <table class="layui-table" style="width: 45vw; background-color: #fefefe;border: .1vw solid #d0e5ff; margin: 1vw 0;">
        <colgroup>
            <col>
            <col>
            <col>
            <col>
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>参数</th>
                <th>类型</th>
                <th>必须</th>
                <th>说明</th>
                <th>示例</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>image</td>
                <td>file</td>
                <td>是</td>
                <td>问题相关图片</td>
                <td>无</td>
            </tr>
            <tr>
                <td>question</td>
                <td>string</td>
                <td>是</td>
                <td>用户的问题</td>
                <td>请解析一下这张图片</td>
            </tr>
            <tr>
                <td>authorization</td>
                <td>请求头参数</td>
                <td>是</td>
                <td>用户鉴权根据</td>
                <td>即你的ApiKey</td>
            </tr>
        </tbody>
    </table>
    <div style="font-weight: 700;">Demo</div>
    <div>以下是客户端调用文曲星接口的代码示例（Java）：</div>
<pre class="layui-code code-demo" style="margin-bottom: 1vw;">
  public static void main(String[] args) throws IOException {
  String question = "yourQuestion";
  String authorization = "yourAuthorization";
  File file = new File("your/file/path");
  // 从 File 对象中创建 FileInputStream
  FileInputStream inputStream = new FileInputStream(file);
  // 创建 MockMultipartFile 对象
  MultipartFile image = new MockMultipartFile("file", file.getName(), "application/octet-stream", inputStream);
  String boundary = "----" + UUID.randomUUID().toString();
  CloseableHttpClient httpClient = HttpClients.createDefault();
  HttpPost httpPost = new HttpPost("http://106.53.218.88:10010/QaA/api/image");
  httpPost.setHeader("Content-Type", "multipart/form-data; boundary="+boundary);
  httpPost.addHeader("authorization",authorization);
  // 创建多部分实体构建器
  MultipartEntityBuilder builder = MultipartEntityBuilder.create();
  builder.setBoundary(boundary);
  // 添加文本参数
  builder.addTextBody("question", question, ContentType.create("text/plain", StandardCharsets.UTF_8));
  // 添加文件参数
  byte[] fileBytes = image.getBytes(); // file 是 MultipartFile 对象
  builder.addBinaryBody(
    "file",
    new ByteArrayInputStream(fileBytes), // 使用文件的字节数组创建输入流
    ContentType.APPLICATION_OCTET_STREAM,
    image.getOriginalFilename() // 获取文件原始名称
  );
  // 构建多部分实体
  HttpEntity multipartEntity = builder.build();
  httpPost.setEntity(multipartEntity);
  CloseableHttpResponse httpResponse = httpClient.execute(httpPost);
  HttpEntity entity = httpResponse.getEntity();
  InputStreamReader inputStreamReader = new InputStreamReader(entity.getContent(), StandardCharsets.UTF_8);
  BufferedReader reader = new BufferedReader(inputStreamReader);
  String line;
  while ((line = reader.readLine()) != null) {
    System.out.println(line+"\t"); // 打印接收到的数据
  //你的逻辑
  }
}
</pre>

    <h2 id="mid2-3">上传语音</h2>
    <div>上传音频时，需按照以下要求：</div>
    <table class="layui-table" style="width: 45vw; background-color: #fefefe;border: .1vw solid #d0e5ff; margin: 1vw 0;">
        <colgroup>
            <col width="150">
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>内容</th>
                <th>说明</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>请求协议</td>
                <td>http</td>
            </tr>
            <tr>
                <td>请求地址</td>
                <td>http://106.53.218.88:10010/QaA/api/audio</td>
            </tr>
            <tr>
                <td>请求类型</td>
                <td>POST</td>
            </tr>
            <tr>
                <td>接口鉴权</td>
                <td>见下方接口鉴权</td>
            </tr>
            <tr>
                <td>字符编码</td>
                <td>UTF-8</td>
            </tr>
            <tr>
                <td>响应格式</td>
                <td>直接响应文本数据</td>
            </tr>
            <tr>
                <td>接收方式</td>
                <td>流式接收</td>
            </tr>
            <tr>
                <td>开发语言</td>
                <td>任意，可以向文曲星服务发起http请求即可</td>
            </tr>
            <tr>
                <td>操作系统</td>
                <td>任意</td>
            </tr>
            <tr>
                <td>问题类型</td>
                <td>任何问题均可，关于课程相关知识点的回复更加精确和详细</td>
            </tr>
            <tr>
                <td>语言种类</td>
                <td>中文</td>
            </tr>
            <tr>
                <td>文件类型</td>
                <td>pcm文件</td>
            </tr>
        </tbody>
    </table>
    <div style="font-weight: 700;">接口参数</div>
    <div>authorization为请求头参数，audio为请求体参数并且为form-data格式。</div>
    <table class="layui-table" style="width: 45vw; background-color: #fefefe;border: .1vw solid #d0e5ff; margin: 1vw 0;">
        <colgroup>
            <col>
            <col>
            <col>
            <col>
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>参数</th>
                <th>类型</th>
                <th>必须</th>
                <th>说明</th>
                <th>示例</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>audio</td>
                <td>file</td>
                <td>是</td>
                <td>音频文件且为.pcm文件</td>
                <td>无</td>
            </tr>
                <td>authorization</td>
                <td>请求头参数</td>
                <td>是</td>
                <td>用户鉴权根据</td>
                <td>即你的ApiKey</td>
            </tr>
        </tbody>
    </table>
    <div style="font-weight: 700;">Demo</div>
    <div>以下是客户端调用文曲星接口的代码示例（Java）：</div>
<pre class="layui-code code-demo" style="margin-bottom: 1vw;">
  public static void main(String[] args) throws IOException {
  String authorization = "yourAuthorization";
  File file = new File("your/file/path");
  // 从 File 对象中创建 FileInputStream
  FileInputStream inputStream = new FileInputStream(file);
  // 创建 MockMultipartFile 对象
  MultipartFile audio = new MockMultipartFile("file", file.getName(), "application/octet-stream", inputStream);
  String boundary = "----" UUID.randomUUID().toString();
  CloseableHttpClient httpClient = HttpClients.createDefault();
  HttpPost httpPost = new HttpPost("http://106.53.218.88:10010/QaA/api/audio");
  httpPost.setHeader("Content-Type", "multipart/form-data; boundary="+boundary);
  httpPost.addHeader("authorization",authorization);
  // 创建多部分实体构建器
  MultipartEntityBuilder builder = MultipartEntityBuilder.create();
  builder.setBoundary(boundary);
  // 添加文件参数
  bytefileBytes = audio.getBytes();
  builder.addBinaryBody(
    "audio",
    new ByteArrayInputStream(fileBytes), // 使用文件的字节数组创建输入流
    ContentType.APPLICATION_OCTET_STREAM,
    audio.getOriginalFilename() // 获取文件原始名称
  );
  // 构建多部分实体
  HttpEntity multipartEntity = builder.build();
  httpPost.setEntity(multipartEntity);
  CloseableHttpResponse httpResponse = httpClient.execute(httpPost);
  HttpEntity entity = httpResponse.getEntity();
  InputStreamReader inputStreamReader = new InputStreamReader(entity.getContent(), StandardCharsets.UTF_8);
      BufferedReader reader = new BufferedReader(inputStreamReader);
      String line;
      while ((line = reader.readLine()) != null) {
        System.out.println(line+"\t"); // 打印接收到的数据
      //你的逻辑
      }
    }
</pre>

    <br><br><br>

    <h1 id="mid3">接口鉴权</h1>
    <div>文曲星OpenApi接口鉴权依赖于用户的ApiKey，每个用户只会生成唯一对应的ApiKey，请妥善保管。<br>ApiKey的获取：在此页面登录后，点击“查看ApiKey”即可完成查看。</div>
    <h2 id="mid3-1">鉴权结果</h2>
    <table class="layui-table" style="width: 45vw; background-color: #fefefe;border: .1vw solid #d0e5ff; margin: 1vw 0;">
        <colgroup>
            <col>
            <col>
            <col>
        </colgroup>
        <thead>
            <tr>
                <th>HTTP Code</th>
                <th>说明</th>
                <th>解决方案</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>401</td>
                <td>缺少authorization参数</td>
                <td>检查是否有authorization参数</td>
            </tr>
                <td>401</td>
                <td>签名参数解析失败</td>
                <td>检查签名的各个参数是否有缺失是否正确，特别确认下复的ApiKey是否正确</td>
            </tr>
            </tr>
                <td>403</td>
                <td>IP白名单校验失败</td>
                <td>检查IP白名单设置的IP地址是否为本机外网IP地址</td>
            </tr>
        </tbody>
    </table>
    
</div>
    <!-- 底部 -->
    <div class="button"></div>

    <!-- 绝对定位跳转 -->
    <div class="side">
      <a href="#top" class="top aa">文曲星OpenApi文档</a>
      <a href="#mid1" class="mid1 aa">接口说明</a>
      <a href="#mid2" class="mid2 aa">接口要求及Demo</a>
      <a href="#mid2-1" class="mid2-1 aa">文本格式问题</a>
      <a href="#mid2-2" class="mid2-2 aa">附带图片上传</a>
      <a href="#mid2-3" class="mid2-3 aa">上传语音</a>
      <a href="#mid3" class="mid3 aa">接口鉴权</a>
      <a href="#mid3-1" class="mid3-1 aa">鉴权结果</a>
    </div>
  </body>
  <style>
    /* 头部 */
    .header {
      width: 100vw;
      height: 12.43vw;
      background: url("./static/header.png") no-repeat;
      background-size: 100% 100%;
    }
    .header .login {
      display: block;
      position: absolute;
      top: 2vw;
      right: 9vw;
      width: 5.5vw;
      height: 2.8vw;
      color: #6996f0;
      font-size: 1.1111vw;
    }
    .header .login-success {
      display: none;
      position: absolute;
      float: right;
      top: 2vw;
      right: 9.5vw;
      font-size: 1vw;
    }
    .header .login-success button {
      width: 8vw;
      height: 2.7vw;
      color: #6996f0;
      font-size: 1.1111vw;
      margin-left: 1vw;
    }

    /* 中间文档 */
    .main {
      margin: 1vw 0 3vw 25vw;
      width: 55vw;
      /* border: 1px solid pink; */
    }
    .main div {
      font-size: 1vw;
      margin: 0.4vw 0;
      line-height: 1.6667vw;
    }
    .main h1 {
      margin-bottom: 1vw;
    }
    .main h2 {
      margin-bottom: 0.6vw;
    }

    /* 底部 */
    .button {
      width: 100vw;
      height: 7.361vw;
      background: url("./static/button.png") no-repeat;
      background-size: 100% 100%;
    }

    .side {
      position: fixed;
      top: 13.43vw;
      left: 0;
      border-right: 0.1vw solid #aaa;
      width: 18vw;
      height: 19vw;
      padding: 1vw 0 0 3vw;
    }

    /* 绝对定位跳转 */
    .top {
      font-size: 1.1vw;
      font-weight: 500;
    }
    .mid1 {
      font-size: 1vw;
      padding-left: 1vw;
    }
    .mid2 {
      font-size: 1vw;
      padding-left: 1vw;
    }
    .mid2-1 {
      font-size: 0.8vw;
      padding-left: 1.6vw;
      font-weight: 300;
    }
    .mid2-2 {
      font-size: 0.8vw;
      padding-left: 1.6vw;
      font-weight: 300;
    }
    .mid2-3 {
      font-size: 0.8vw;
      padding-left: 1.6vw;
      font-weight: 300;
    }
    .mid3 {
      font-size: 1vw;
      padding-left: 1vw;
    }
    .mid3-1 {
      font-size: 0.8vw;
      padding-left: 1.6vw;
      font-weight: 300;
    }

    .aa {
      display: block;
      margin-bottom: 1vw;
    }
    .aa:hover {
      color: #6996f0;
    }
  </style>
</html>
